<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>商品管理</title>
  <link rel="stylesheet" href="gl.css">
</head>

<body>
  <!-- 等待时的遮罩 -->
  <div id="waitDialog">
    <div>等待中，请稍后</div>
  </div>
  <!-- 添加和查询 的部分-->
  <div class="button">
    <button id="btnAdd" class="button-color">添加商品信息</button>
    <button id="btnQuery" class="button-color">查询商品信息</button>
    <button id="btnReset" class="button-color">重置</button>
  </div>

  <body>
    <!-- 数据表格 -->
    <div class="card ">
      <table border="1" style="border-collapse: 0;">
        <thead>
          <tr>
            <th>商品编号</th>
            <th>商品名称</th>
            <th>信息最后修改时间</th>
            <th>商品价格</th>
            <th>所属分类编号</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody id="tbData">

        </tbody>
        <div class="tc">
          <span id="spPre" class="pager">上一页</span>
          <span id="spPage"></span>
          <span id="spNext" class="pager">下一页</span>
        </div>

      </table>
    </div>
  </body>



  <!-- 查询在弹出对话框  模糊查询-->
  <div id="divEnquiryDiglog">
    <div>
      <div>查询商品信息</div>

      <div>
        商品名称:<input type="text" id="keywords" placeholder="请输入商品关键字">
      </div>

      <div>
        <button id="queryByName">查询</button>
        <button id="btnCloseAddT">关闭</button>
      </div>
    </div>
  </div>
  <!-- 添加的弹出对话框 -->
  <div id="divAddDiglog">
    <div>
      <div>添加商品信息</div>
      <div>
        商品名称：<input type="text" id="goodsName" placeholder="请输入商品名称">
      </div>
      <div>
        商品价格：<input type="text" id="price" placeholder="请输入商品价格">
      </div>
      <div>
        所属商品分类： <select id="category">
          <option value="1">家用电器类</option>
          <option value="2">服装</option>
          <option value="1">瓜果蔬菜类</option>
          <option value="1">电子设备</option>
          <option value="2">护肤品</option>
        </select>
      </div>
      <div>
        <button id="btnAddGoods">添加</button>
        <button id="btnCloseAdd">关闭</button>
      </div>
    </div>
  </div>

  <!-- 修改的表单和对话框 -->
  <div id="divModifyDialog">
    <div>
      <div>修改信息</div>
      <div>
        商品名称：<input type="text" id="editGoodsName" placeholder="商品名称">
      </div>
      <div>
        商品价格：<input type="text" id="editGoodsPrice" placeholder="商品价格">
      </div>
      <div>
        所属商品分类：<select id="editselect">
          <option value="1">家用电器类</option>
          <option value="2">服装</option>
          <option value="1">瓜果蔬菜类</option>
          <option value="2">电子设备</option>
          <option value="1">护肤品</option>
          <option value="2">饮料</option>

          <option value="其他">其他</option>
        </select>
      </div>
      <div>
        <button id="editSave">保存</button>
        <button id="btnCloseModify">关闭</button>
      </div>
    </div>
  </div>


  <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
  <script src="https://cdn.bootcdn.net/ajax/libs/qs/6.10.1/qs.min.js"></script>
  <script src="https://cdn.bootcdn.net/ajax/libs/spark-md5/3.0.0/spark-md5.min.js"></script>
  <!-- 通用的ajax请求js -->
  <script src="seever.js"></script>

  <script src="gl.js"></script>
</body>

</html>